<template>
  <el-switch
    :modelValue="val"
    @update:model-value="updateValue"
    :inlinePrompt="ui.inlinePrompt"
    :loading="ui.loading"
    :activeIcon="ui.activeIcon"
    :inactiveIcon="ui.inactiveIcon"
    :activeText="ui.activeText"
    :inactiveText="ui.inactiveText"
    :activeValue="ui.activeValue"
    :inactiveValue="ui.activeValue"
  />
</template>

<script lang="ts" setup name="lc-sf-switch">
import { inject, computed } from "vue";
import { SwitchUI } from "../interface";
import { SFService } from "../sf.service";
import { TItemOption } from "../type";
const props = defineProps<TItemOption<SwitchUI>>();
const sf = inject<SFService>("sf-service");
const val = computed(() => {
  return sf.getVaule(props.keyPath);
});
const ui = props.service.getUI<SwitchUI>();
const updateValue = (val: string | number | boolean) => {
  if (ui.change) {
    ui.change(val);
  }
  sf.setVaule(props.keyPath, val);
};
</script>

<style></style>
../types
